<template>
  <div>
    <div>
      <router-link to="/Car/SetList">
        <el-button type="info" icon="el-icon-arrow-left" size="mini">返回</el-button>
      </router-link>
    </div>
    <br />
   <el-row>
     <el-col :span="24">
       <el-form :model="SetEdit" label-width="100px" :rules="rules" ref="SetEdit" label-position="top" :inline="true" size="medium">
           <el-form-item label="类型" prop="TypeID">
            <el-select v-model="SetEdit.TypeID" style="width:649px">
              <el-option v-for="(item,index) in SetType.Type" :key="index" :value="item.ID" :label="item.TypeName_CHS"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="状态" prop="StatusID">
            <el-select v-model="SetEdit.StatusID" style="width:649px">
              <el-option v-for="(item,index) in SetType.Set" :key="index" :value="item.ID" :label="item.StatusName_CHS"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="标题" prop="Title">
            <el-input placeholder v-model="SetEdit.Title"></el-input>
          </el-form-item>
          <el-form-item label="里程数" prop="Mileage">
            <el-input placeholder v-model="SetEdit.Mileage"></el-input>
          </el-form-item>
          <el-form-item label="购车日期" prop="BuyDate">
        
              <el-date-picker v-model="SetEdit.BuyDate" type="datetime" placeholder="选择日期时间" style="width:649px"></el-date-picker>
              
          </el-form-item>
          <el-form-item label="上次保养" prop="LastMaintenance">
         
              <el-date-picker v-model="SetEdit.LastMaintenance" type="datetime" placeholder="选择日期时间" style="width:649px"></el-date-picker>
                 
          </el-form-item>
          <el-form-item label="描述" prop="Description"> 
          
              <el-input type="textarea" v-model="SetEdit.Description" ></el-input>
            
          </el-form-item>
          <el-form-item label="备注" prop="Note">          
              <el-input type="textarea" v-model="SetEdit.Note"></el-input>
          </el-form-item>
       </el-form>
     </el-col>
   </el-row>
    <br />
    <div>
      <el-button type="primary" size="mini" @click="Baochun('SetEdit')" icon="el-icon-check">保存</el-button>
      <el-button size="mini" type="info" @click="$router.go(-1)" icon="el-icon-close">取消</el-button>
    </div>
  </div>
</template>
<style lang="scss" scoped>
.el-row {
  margin-bottom: 10px;
}
.el-form-item {
  width: 49%;
}
</style>
<script>
export default {
  data(){
    return {
     SetEdit:{
       TypeID:"",
       StatusID:"",
       Title:"",
       Mileage:"",
       BuyDate:"",
       LastMaintenance:"",
       Description:"",
       Note:""
     },
     SetType:{},
     Type:"Add",
     rules:{
       TypeID:[
          {required:true,message:'请输入内容',trigger:'blur'}
       ],
       StatusID:[
          {required:true,message:'请输入内容',trigger:'blur'}
       ],
       Title:[
          {required:true,message:'请输入内容',trigger:'blur'}
       ],
       Mileage:[
          {required:true,message:'请输入内容',trigger:'blur'}
       ]
       ,BuyDate:[
          {required:true,message:'请输入内容',trigger:'blur'}
       ],
       LastMaintenance:[
          {required:true,message:'请输入内容',trigger:'blur'}
       ],
        Description:[
           {min:1,max:100,message:"长度在1到100之间"}
       ],
        Note:[
          {required:true,message:'请输入内容',trigger:'blur'}
       ]

     }
      }
  },
  mounted(){
    //获取类型
     this.$axios({
      url: '/HrApi/CarSet/GetTypeList',
      method: 'GET'
    }).then(res => {
      this.SetType = res.data.data
    });
    //根据ID获取数据
     if(Object.keys(this.$route.query).length){
        this.Type = "Edit";
        this.$axios({
        url: "/HrApi/CarSet/GetSetInfo",
        method: "GET",
        params:{
          id: this.$route.query["id"]
        },
        }).then((res) => {
        if (!res.data.code) {
          this.SetEdit = res.data.data;
        } else {
          this.$message.error(res.data.msg);
        }
      });
      }
      },
  methods:{
    Baochun(SetEdit){
      this.$refs[SetEdit].validate((valid) => {
        if (!valid) {
          return false;
        }
       this.$axios({
          url: "/HrApi/CarSet/UpdateSet",
          method: "POST",
          data: this.$Qs.stringify({
            type:this.Type,
            SetEdit: JSON.stringify(this.SetEdit)
          }),
        }).then((res) => {
          if (!res.data.code) {
            //添加成功，重置表单
            if(this.Type==="Add"){
              this.$refs[SetEdit].resetFields();
            } 
              this.$message.success(res.data.msg);
          } else {
            this.$message.error(res.data.msg);
          }
        })
      })
    }
  }
}
</script>
